<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link href="./static/css/base.css" rel="stylesheet">
    <link href="./static/css/tailwind.min.css" rel="stylesheet">
    <link href="https://fonts.font.im/css?family=Source+Serif+Pro%7CLato%7CInconsolata" rel="stylesheet"
        type="text/css">
    <title> {{ title }} </title>
    <!-- browser favicon -->
    <link rel="shortcut icon" href="./static/img/favicon.ico">
    <style>
        .font-sans {
            font-family: 'Lato', 'SimHei', 'STHeiti', 'SimHei', 'Serif';
        }

        .font-serif {
            font-family: 'Source Serif Pro', 'Songti SC', 'SimSun', 'Serif', serif;
        }
    </style>
    <link rel="stylesheet" href="./static/katex/katex.min.css">
    <script defer src="./static/katex/katex.min.js"></script>
    <script defer src="./static/katex/auto-render.min.js"></script>
    <script>
        document.addEventListener("DOMContentLoaded", function () {
            renderMathInElement(document.body, {
                // customised options
                // &#8226; auto-render specific keys, e.g.:
                delimiters: [
                    { left: '$$', right: '$$', display: true },
                    { left: '$', right: '$', display: false },
                    { left: '\\(', right: '\\)', display: false },
                    { left: '\\[', right: '\\]', display: true }
                ],
                // &#8226; rendering keys, e.g.:
                throwOnError: false
            });
        });
    </script>

    <link rel="stylesheet" href="./static/reveal/reveal.css">
    <link rel="stylesheet" href="./static/reveal/theme/simple.css" id="theme">
    <link rel="stylesheet" href="./static/jyy/jyy.css">

</head>

<body class="d-flex flex-column h-100">

    <div class="reveal">
        <div class="slides">
            {{ body }}
        </div>
    </div>

    <script src="./static/reveal/reveal.js"></script>

    <script>
        Reveal.initialize({

            width: 1024, height: 768,

            slideNumber: 'c/t',
            controlsTutorial: false,
            progress: false,
            hash: true,
            center: false,
            autoAnimateUnmatched: true,
            autoAnimateEasing: 'ease-out',
            autoAnimateDuration: 0.3,
            transitionSpeed: 'fast'
        });
    </script>
</body>

</html>
